<template>
  <div class="page-box">
    <universal-table
      :columns="columns"
      :fetch-data="fetchTableData"
      permission-prefix="sys:nfc_authorization"
      :show-selection="true"
      :show-index="true"
      :show-operation="true"
      :operation-width="'200'"
      :bt1-name="''"
      :bt2-name="''"
      :export-file-name="'NFC使用权限管理'"
      :init-search-form="{}"
      :custom-export="true"
      :show-keyword-search="true"
      @edit="handleEdit"
      @delete="handleDelete"
      @reset="reset"
      @selection-change="handleSelectionChange"
      @custom-export="handleExportCSV"
      ref="table">

      <!-- 搜索区域扩展 -->
      <template #searchExtend>
        <el-form-item prop="is_authorized">
          <el-select v-model="searchForm.is_authorized" placeholder="NFC权限状态" clearable>
            <el-option label="有权限" value="1"></el-option>
            <el-option label="无权限" value="0"></el-option>
          </el-select>
          <el-tooltip placement="top">
            <div slot="content" style="max-width: 480px; line-height: 1.5;">
              <div><strong>定义：</strong>商户的NFC功能使用权限状态筛选</div>
              <div><strong>权限说明：</strong></div>
              <div>• <strong>有权限：</strong>可以创建NFC活动、生成领奖码、查看数据报表</div>
              <div>• <strong>无权限：</strong>无法使用任何NFC功能，需要管理员开通</div>
              <div><strong>数据来源：</strong><code>consul_nfc_merchant_authorization</code>（is_authorized字段）</div>
              <div style="margin-top: 8px; padding: 8px; background: #2c3e50; border-radius: 4px; color: #fff;">
                <div><strong>💡 权限管理流程：</strong></div>
                <div>• <strong>新商户注册：</strong>默认无权限（is_authorized=0）</div>
                <div>• <strong>权限开通：</strong>管理员操作，记录authorized_by和authorized_time</div>
                <div>• <strong>权限回收：</strong>设置is_authorized=0，保留历史记录</div>
                <div>• <strong>批量操作：</strong>支持批量开通和回收权限</div>
                <div>• <strong>软删除：</strong>支持delete_time软删除机制</div>
                <div style="color: #bdc3c7; font-size: 12px;">注：每个商户只有一条授权记录（UNIQUE merchant_id）</div>
              </div>
            </div>
            <i class="el-icon-question" style="margin-left:6px;color:#909399;cursor:help;"></i>
          </el-tooltip>
        </el-form-item>

        <!-- 批量操作按钮区域 -->
        <el-form-item>
          <el-tooltip placement="top">
            <div slot="content" style="max-width: 520px; line-height: 1.5;">
              <div><strong>功能：</strong>批量为选中的商户开通NFC使用权限</div>
              <div><strong>前置条件：</strong>必须勾选表格行，且只对无权限商户生效</div>
              <div><strong>执行逻辑：</strong>自动过滤已有权限的商户，只处理无权限商户</div>
              <div><strong>操作记录：</strong>统一备注"批量开通权限"，记录开通时间和操作人</div>
              <div style="margin-top: 8px; padding: 8px; background: #67C23A; border-radius: 4px; color: #fff;">
                <div><strong>💡 使用建议：</strong></div>
                <div>• 新商户入驻后批量开通权限</div>
                <div>• 定期审核符合条件的商户</div>
                <div>• 支持混选，系统自动识别权限状态</div>
                <div style="color: #ecf0f1; font-size: 12px;">注：开通后商户可立即使用NFC功能</div>
              </div>
            </div>
            <el-button type="success" icon="el-icon-check" @click="handleBatchAuthorize" :disabled="!hasSelection">
              批量开通权限
            </el-button>
          </el-tooltip>
          <el-tooltip placement="top">
            <div slot="content" style="max-width: 520px; line-height: 1.5;">
              <div><strong>功能：</strong>批量回收选中商户的NFC使用权限</div>
              <div><strong>前置条件：</strong>必须勾选表格行，且只对有权限商户生效</div>
              <div><strong>执行逻辑：</strong>自动过滤无权限的商户，只处理有权限商户</div>
              <div><strong>操作记录：</strong>统一备注"批量回收权限"，记录回收时间和操作人</div>
              <div><strong>影响范围：</strong>商户将无法创建活动、无法使用NFC功能</div>
              <div style="margin-top: 8px; padding: 8px; background: #E6A23C; border-radius: 4px; color: #fff;">
                <div><strong>⚠️ 重要提醒：</strong></div>
                <div>• 回收权限会立即生效，商户无法继续使用NFC功能</div>
                <div>• 已创建的活动和数据不会被删除</div>
                <div>• 可能返回部分成功结果（成功数/失败数）</div>
                <div style="color: #ecf0f1; font-size: 12px;">注：请谨慎操作，建议逐个回收并填写详细原因</div>
              </div>
            </div>
            <el-button type="warning" icon="el-icon-close" @click="handleBatchRevoke" :disabled="!hasSelection">
              批量回收权限
            </el-button>
          </el-tooltip>
          <el-tooltip content="重新加载商户权限列表数据" placement="top">
            <el-button type="primary" @click="handleRefresh">
              <i class="el-icon-refresh"></i> 刷新
            </el-button>
          </el-tooltip>
        </el-form-item>

      </template>

      <!-- 操作栏扩展 -->
      <template #operationExtend="{ row }">
        <el-tooltip placement="top" v-if="!row.is_authorized">
          <div slot="content" style="max-width: 400px; line-height: 1.5;">
            <div><strong>功能：</strong>开通该商户的NFC使用权限</div>
            <div><strong>权限范围：</strong>活动管理、模板管理、数据分析等全部NFC功能</div>
            <div><strong>操作要求：</strong>可选择填写开通备注，记录开通原因</div>
            <div><strong>生效时间：</strong>立即生效，商户可马上使用NFC功能</div>
            <div style="color: #67C23A; font-size: 12px; margin-top: 4px;">注：开通后将记录开通时间和操作管理员</div>
          </div>
          <el-button size="mini" type="success" icon="el-icon-check" @click="handleAuthorize(row)" circle></el-button>
        </el-tooltip>
        <el-tooltip placement="top" v-if="row.is_authorized">
          <div slot="content" style="max-width: 400px; line-height: 1.5;">
            <div><strong>功能：</strong>回收该商户的NFC使用权限</div>
            <div><strong>影响范围：</strong>商户将无法访问任何NFC功能模块</div>
            <div><strong>操作要求：</strong>必须填写回收原因，便于后续追溯</div>
            <div><strong>数据保留：</strong>已创建的活动和历史数据不会被删除</div>
            <div style="color: #E6A23C; font-size: 12px; margin-top: 4px;">⚠️ 请谨慎操作，回收权限立即生效</div>
          </div>
          <el-button size="mini" type="warning" icon="el-icon-close" @click="handleRevoke(row)" circle></el-button>
        </el-tooltip>
        <el-tooltip placement="top" v-if="row.is_authorized">
          <div slot="content" style="max-width: 400px; line-height: 1.5;">
            <div><strong>功能：</strong>查看该商户创建的优惠券模板</div>
            <div><strong>显示内容：</strong>模板ID、名称、类型、库存、发放量、状态等</div>
            <div><strong>使用场景：</strong>了解商户NFC活动运营情况</div>
            <div><strong>权限要求：</strong>仅有权限商户显示此按钮</div>
            <div style="color: #409EFF; font-size: 12px; margin-top: 4px;">💡 可帮助评估商户活跃度和运营能力</div>
          </div>
          <el-button size="mini" type="primary" icon="el-icon-tickets" @click="handleViewTemplates(row)" circle></el-button>
        </el-tooltip>
        <el-tooltip placement="top">
          <div slot="content" style="max-width: 400px; line-height: 1.5;">
            <div><strong>功能：</strong>查看该商户的详细信息</div>
            <div><strong>显示内容：</strong>商户ID、名称、权限状态、开通时间、操作管理员、备注等</div>
            <div><strong>使用场景：</strong>权限管理决策参考、问题追溯、审计查看</div>
            <div><strong>权限要求：</strong>所有商户都可查看详情</div>
            <div style="color: #909399; font-size: 12px; margin-top: 4px;">📋 提供商户权限管理的完整信息视图</div>
          </div>
          <el-button size="mini" type="info" icon="el-icon-view" @click="handleViewDetail(row)" circle></el-button>
        </el-tooltip>
      </template>
    </universal-table>

    <!-- 授权对话框 -->
    <el-dialog title="开通NFC使用权限" :visible.sync="authorizeDialogVisible" width="500px" @close="resetAuthorizeForm">
      <el-form :model="authorizeForm" :rules="authorizeRules" ref="authorizeForm" label-width="100px">
        <el-form-item label="商户名称">
          <el-input v-model="currentMerchant.merchant_name" disabled></el-input>
        </el-form-item>
        <el-form-item label="商户ID">
          <el-input v-model="currentMerchant.merchant_id" disabled></el-input>
        </el-form-item>
        <el-form-item label="开通备注" prop="remarks">
          <el-input
            v-model="authorizeForm.remarks"
            type="textarea"
            :rows="3"
            placeholder="请输入开通备注（可选）"
            maxlength="200"
            show-word-limit>
          </el-input>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="authorizeDialogVisible = false">取消</el-button>
        <el-button type="primary" @click="confirmAuthorize" :loading="authorizeLoading">确定开通</el-button>
      </div>
    </el-dialog>

    <!-- 取消授权对话框 -->
    <el-dialog title="回收NFC使用权限" :visible.sync="revokeDialogVisible" width="500px" @close="resetRevokeForm">
      <el-form :model="revokeForm" :rules="revokeRules" ref="revokeForm" label-width="100px">
        <el-form-item label="商户名称">
          <el-input v-model="currentMerchant.merchant_name" disabled></el-input>
        </el-form-item>
        <el-form-item label="商户ID">
          <el-input v-model="currentMerchant.merchant_id" disabled></el-input>
        </el-form-item>
        <el-form-item label="回收原因" prop="remarks">
          <el-input
            v-model="revokeForm.remarks"
            type="textarea"
            :rows="3"
            placeholder="请输入回收权限的原因"
            maxlength="200"
            show-word-limit>
          </el-input>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="revokeDialogVisible = false">取消</el-button>
        <el-button type="danger" @click="confirmRevoke" :loading="revokeLoading">确定回收</el-button>
      </div>
    </el-dialog>

    <!-- 商家详情对话框 -->
    <el-dialog title="商家详情" :visible.sync="detailDialogVisible" width="600px">
      <el-descriptions :column="2" border v-if="merchantDetail">
        <el-descriptions-item label="商户ID">{{ merchantDetail.merchant_id }}</el-descriptions-item>
        <el-descriptions-item label="商户名称">{{ merchantDetail.merchant_name }}</el-descriptions-item>
        <el-descriptions-item label="NFC使用权限">
          <el-tag :type="merchantDetail.is_authorized ? 'success' : 'danger'">
            {{ merchantDetail.is_authorized ? '有权限' : '无权限' }}
          </el-tag>
        </el-descriptions-item>
        <el-descriptions-item label="开通时间">
          {{ merchantDetail.authorized_time || '未开通' }}
        </el-descriptions-item>
        <el-descriptions-item label="操作管理员">{{ merchantDetail.authorized_by_name || '-' }}</el-descriptions-item>
        <el-descriptions-item label="创建时间">{{ merchantDetail.create_time }}</el-descriptions-item>
        <el-descriptions-item label="更新时间">{{ merchantDetail.update_time }}</el-descriptions-item>
        <el-descriptions-item label="备注" :span="2">
          {{ merchantDetail.remarks || '无' }}
        </el-descriptions-item>
      </el-descriptions>
    </el-dialog>

    <!-- 模板列表对话框 -->
    <el-dialog title="优惠券模板" :visible.sync="templatesDialogVisible" width="800px">
      <el-table :data="merchantTemplates" border stripe>
        <el-table-column prop="id" label="模板ID" width="80"></el-table-column>
        <el-table-column prop="name" label="模板名称" min-width="120"></el-table-column>
        <el-table-column prop="type_text" label="类型" width="100"></el-table-column>
        <el-table-column prop="stock" label="库存" width="80"></el-table-column>
        <el-table-column prop="issued_count" label="已发放" width="80"></el-table-column>
        <el-table-column prop="status_text" label="状态" width="80">
          <template slot-scope="scope">
            <el-tag :type="scope.row.status === 1 ? 'success' : 'danger'">
              {{ scope.row.status_text }}
            </el-tag>
          </template>
        </el-table-column>
        <el-table-column prop="create_time" label="创建时间" width="150"></el-table-column>
      </el-table>
    </el-dialog>
  </div>
</template>

<script>
import {
  getAuthorizationList,
  authorizeMerchant,
  revokeMerchantAuthorization,
  batchAuthorizeMerchants,
  batchRevokeMerchantAuthorization,
  exportAuthorizationCSV
} from '@/api/nfc/authorization'
import { getTemplateList } from '@/api/nfc/template'
import { handleCSVExportResponse } from '@/utils/exportCSV'
import UniversalTable from '@/components/TableComponent.vue'

export default {
  name: 'NfcAuthorization',
  components: {
    UniversalTable
  },
  data() {
    return {
      // 搜索表单
      searchForm: {
        is_authorized: ''
      },

      // 表格列配置
      columns: [
        { 
          prop: 'merchant_name', 
          label: '商户名称', 
          minWidth: 150, 
          sortable: true,
          tooltip: '商户的注册名称，来源于商户基础信息表，与NFC授权记录关联'
        },
        { 
          prop: 'contacts', 
          label: '联系人', 
          width: 100,
          tooltip: '商户主要联系人姓名，来源于商户基础信息，用于权限相关沟通'
        },
        { 
          prop: 'contacts_tel', 
          label: '联系电话', 
          width: 120,
          tooltip: '商户联系人电话，来源于商户基础信息，用于紧急情况联系'
        },
        {
          prop: 'is_authorized',
          label: 'NFC使用权限',
          width: 120,
          tag: true,
          tagConfig: {
            '1': { type: 'success', text: '有权限' },
            '0': { type: 'danger', text: '无权限' }
          },
          tooltip: {
            content: `
              <div style="max-width: 480px; line-height: 1.5;">
                <div><strong>定义：</strong>商户是否拥有NFC功能使用权限</div>
                <div><strong>状态说明：</strong></div>
                <div>• <strong>有权限（绿标）：</strong>可以创建NFC活动、管理优惠券模板、查看数据报表</div>
                <div>• <strong>无权限（红标）：</strong>无法访问任何NFC功能模块，需要管理员开通</div>
                <div><strong>权限范围：</strong>活动管理、模板管理、数据分析、用户管理等全部NFC功能</div>
                <div style="margin-top: 8px; padding: 8px; background: #34495e; border-radius: 4px; color: #fff;">
                  <div><strong>💡 权限控制说明：</strong></div>
                  <div>• <strong>默认状态：</strong>新注册商户默认无权限</div>
                  <div>• <strong>开通流程：</strong>商户申请 → 管理员审核 → 开通权限</div>
                  <div>• <strong>权限作用：</strong>前端菜单显隐、API接口鉴权</div>
                  <div style="color: #bdc3c7; font-size: 12px;">注：权限变更立即生效，会影响商户端功能访问</div>
                </div>
              </div>
            `,
            html: true
          }
        },
        {
          prop: 'authorized_time_format',
          label: '开通时间',
          width: 160,
          sortable: true,
          formatter: (row) => row.authorized_time_format || '未开通',
          tooltip: {
            content: `
              <div style="max-width: 480px; line-height: 1.5;">
                <div><strong>定义：</strong>管理员开通该商户NFC权限的具体时间</div>
                <div><strong>时间格式：</strong>YYYY-MM-DD HH:mm:ss</div>
                <div><strong>数据来源：</strong><code>consul_nfc_merchant_authorization.authorized_time</code></div>
                <div><strong>显示逻辑：</strong></div>
                <div>• <strong>有权限：</strong>显示具体开通时间</div>
                <div>• <strong>无权限：</strong>显示"未开通"</div>
                <div style="margin-top: 8px; padding: 8px; background: #2c3e50; border-radius: 4px; color: #fff;">
                  <div><strong>💡 关联字段说明：</strong></div>
                  <div>• <strong>开通时间：</strong>authorized_time字段记录</div>
                  <div>• <strong>操作人员：</strong>authorized_by字段记录操作员ID</div>
                  <div>• <strong>权限审计：</strong>完整的操作历史追踪</div>
                  <div>• <strong>数据用途：</strong>统计分析、责任确认、时间排序</div>
                  <div style="color: #bdc3c7; font-size: 12px;">注：配合authorized_by可追溯到具体操作人员</div>
                </div>
              </div>
            `,
            html: true
          }
        },
        { 
          prop: 'remarks', 
          label: '备注', 
          minWidth: 120,
          tooltip: {
            content: `
              <div style="max-width: 480px; line-height: 1.5;">
                <div><strong>定义：</strong>管理员对该商户权限操作的备注说明</div>
                <div><strong>数据来源：</strong><code>consul_nfc_merchant_authorization.remarks</code></div>
                <div><strong>内容类型：</strong></div>
                <div>• 开通权限时的备注说明（可选填写）</div>
                <div>• 回收权限时的原因说明（必填）</div>
                <div>• 其他权限相关的重要备注</div>
                <div><strong>字段限制：</strong>最多500个字符</div>
                <div style="margin-top: 8px; padding: 8px; background: #27ae60; border-radius: 4px; color: #fff;">
                  <div><strong>💡 备注作用：</strong></div>
                  <div>• 记录权限变更原因和背景</div>
                  <div>• 便于后续权限审核参考</div>
                  <div>• 问题追溯和责任确认</div>
                  <div>• 权限管理审计记录</div>
                  <div style="color: #ecf0f1; font-size: 12px;">注：建议填写详细备注，便于权限管理和审计</div>
                </div>
              </div>
            `,
            html: true
          }
        }
      ],

      // 选中的行
      selectedRows: [],

      // 对话框状态
      authorizeDialogVisible: false,
      revokeDialogVisible: false,
      detailDialogVisible: false,
      templatesDialogVisible: false,

      // 当前操作的商户
      currentMerchant: {},

      // 授权表单
      authorizeForm: {
        remarks: ''
      },
      authorizeRules: {
        // 备注不是必填项
      },
      authorizeLoading: false,

      // 取消授权表单
      revokeForm: {
        remarks: ''
      },
      revokeRules: {
        remarks: [
          { required: true, message: '请输入回收权限的原因', trigger: 'blur' }
        ]
      },
      revokeLoading: false,

      // 商家详情
      merchantDetail: null,

      // 商家模板列表
      merchantTemplates: []
    }
  },

  computed: {
    hasSelection() {
      return this.selectedRows.length > 0
    }
  },

  methods: {
    // 获取表格数据
    async fetchTableData(params) {
      try {
        const response = await getAuthorizationList({
          ...params,
          ...this.searchForm
        })

        // 转换数据格式以匹配 universal-table 组件期望的格式
        return {
          list: response.data || [],
          total: response.count || 0
        }
      } catch (error) {
        this.$message.error('获取数据失败：' + error.message)
        return { list: [], total: 0 }
      }
    },

    // 选择变化
    handleSelectionChange(selection) {
      this.selectedRows = selection
    },

    // 刷新
    handleRefresh() {
      this.$refs.table.refresh()
    },

    // 重置搜索
    reset() {
      this.searchForm = {
        is_authorized: ''
      }
    },

    // 单个授权
    handleAuthorize(row) {
      this.currentMerchant = row
      this.authorizeDialogVisible = true
    },

    // 确认授权
    async confirmAuthorize() {
      try {
        this.authorizeLoading = true
        await authorizeMerchant({
          merchant_id: this.currentMerchant.merchant_id,
          remarks: this.authorizeForm.remarks
        })
        this.$message.success('开通权限成功')
        this.authorizeDialogVisible = false
        this.handleRefresh()
      } catch (error) {
        this.$message.error('开通权限失败：' + error.message)
      } finally {
        this.authorizeLoading = false
      }
    },

    // 单个取消授权
    handleRevoke(row) {
      this.currentMerchant = row
      this.revokeDialogVisible = true
    },

    // 确认取消授权
    async confirmRevoke() {
      this.$refs.revokeForm.validate(async (valid) => {
        if (valid) {
          try {
            this.revokeLoading = true
            await revokeMerchantAuthorization({
              merchant_id: this.currentMerchant.merchant_id,
              remarks: this.revokeForm.remarks
            })
            this.$message.success('回收权限成功')
            this.revokeDialogVisible = false
            this.handleRefresh()
          } catch (error) {
            this.$message.error('回收权限失败：' + error.message)
          } finally {
            this.revokeLoading = false
          }
        }


      })
    },


    // 批量授权
    async handleBatchAuthorize() {
      if (this.selectedRows.length === 0) {
        this.$message.warning('请选择要开通NFC使用权限的商户')
        return
      }

      const unauthorizedRows = this.selectedRows.filter(row => !row.is_authorized)
      if (unauthorizedRows.length === 0) {
        this.$message.warning('选中的商户都已有NFC使用权限')
        return
      }

      this.$confirm(`确定要开通选中的 ${unauthorizedRows.length} 个商户的NFC使用权限吗？`, '批量开通NFC权限', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(async () => {
        try {
          const merchantIds = unauthorizedRows.map(row => row.merchant_id)
          await batchAuthorizeMerchants({
            merchant_ids: merchantIds,
            remarks: '批量开通权限'
          })
          this.$message.success('批量开通权限成功')
          this.handleRefresh()
        } catch (error) {
          this.$message.error('批量开通权限失败：' + error.message)
        }
      })
    },

    // 批量取消授权
    async handleBatchRevoke() {
      if (this.selectedRows.length === 0) {
        this.$message.warning('请选择要回收NFC使用权限的商户')
        return
      }

      const authorizedRows = this.selectedRows.filter(row => row.is_authorized)
      if (authorizedRows.length === 0) {
        this.$message.warning('选中的商户都无NFC使用权限')
        return
      }

      this.$confirm(`确定要回收选中的 ${authorizedRows.length} 个商户的NFC使用权限吗？`, '批量回收NFC权限', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(async () => {
        try {
          const merchantIds = authorizedRows.map(row => row.merchant_id)
          // 调用批量取消授权API
          const result = await batchRevokeMerchantAuthorization({
            merchant_ids: merchantIds,
            remarks: '批量回收权限'
          })

          // 显示详细结果
          const successCount = result.data?.success_count || 0
          const failedCount = result.data?.failed_count || 0

          if (failedCount > 0) {
            this.$message.warning(`批量回收权限完成：成功 ${successCount} 个，失败 ${failedCount} 个`)
          } else {
            this.$message.success(`批量回收权限成功：${successCount} 个商户`)
          }

          this.handleRefresh()
        } catch (error) {
          this.$message.error('批量回收权限失败：' + error.message)
        }
      })
    },

    // 查看详情
    async handleViewDetail(row) {
      this.merchantDetail = row
      this.detailDialogVisible = true
    },

    // 查看模板
    async handleViewTemplates(row) {
      try {
        const response = await getTemplateList({
          merchant_id: row.merchant_id,
          limit: 100
        })
        this.merchantTemplates = response.data || []
        this.templatesDialogVisible = true
      } catch (error) {
        this.$message.error('获取模板列表失败：' + error.message)
      }
    },

    // 重置授权表单
    resetAuthorizeForm() {
      this.authorizeForm = {
        remarks: ''
      }
      this.currentMerchant = {}
    },

    // 重置取消授权表单
    resetRevokeForm() {
      this.revokeForm = {
        remarks: ''
      }
      this.currentMerchant = {}
      if (this.$refs.revokeForm) {
        this.$refs.revokeForm.clearValidate()
      }
    },

    // 导出CSV数据
    async handleExportCSV() {
      try {
        // 构建导出参数
        const exportParams = {
          ...this.searchForm, // 搜索条件
          mode: 'filter' // 默认导出筛选结果
        }

        // 如果有选中数据，询问用户导出模式
        if (this.selectedRows.length > 0) {
          const action = await this.$confirm(
            `检测到已选中 ${this.selectedRows.length} 条记录，请选择导出方式：`,
            '选择导出方式',
            {
              confirmButtonText: '导出选中记录',
              cancelButtonText: '导出筛选结果',
              distinguishCancelAndClose: true,
              type: 'info'
            }
          ).then(() => 'selected').catch(action => {
            if (action === 'cancel') {
              return 'filter'
            }
            return null // 关闭对话框
          })

          if (!action) {
            return // 用户取消导出
          }

          if (action === 'selected') {
            exportParams.mode = 'selected'
            exportParams.ids = this.selectedRows.map(row => row.merchant_id)
          }
        }

        // 调用导出API
        this.$message.info('正在生成CSV文件，请稍候...')
        const response = await exportAuthorizationCSV(exportParams)

        // 处理下载
        const result = handleCSVExportResponse(response, 'NFC商家授权.csv')
        if (result.success) {
          this.$message.success(`导出成功：${result.filename}`)
        } else {
          throw new Error(result.error)
        }
      } catch (error) {
        console.error('CSV导出失败:', error)

        // 详细的错误处理
        let errorMessage = '导出失败'
        if (error.response) {
          // 服务器响应错误
          if (error.response.data && error.response.data.message) {
            errorMessage = error.response.data.message
          } else {
            errorMessage = `服务器错误: ${error.response.status}`
          }
        } else if (error.message) {
          errorMessage = error.message
        }

        this.$message.error(errorMessage)
      }
    },

    // 这些方法是universal-table组件需要的，但在这个页面中不使用
    handleEdit() {},
    handleDelete() {}
  }
}
</script>

<style scoped>
.page-box {
  padding: 20px;
}

.dialog-footer {
  text-align: right;
}
</style>